<template>
  <view class="container">
    <uni-list>
      <uni-list-item
        showExtraIcon="true"
        :extraIcon="{ type: 'person-filled' }"
        title="员工状态"
        :rightText="form.staffType"
      />
      <uni-list-item
        showExtraIcon="true"
        :extraIcon="{ type: 'person-filled' }"
        title="工号"
        :rightText="form.staffNum"
      />
      <uni-list-item
        showExtraIcon="true"
        :extraIcon="{ type: 'email-filled' }"
        title="工资编号"
        :rightText="form.staffNum"
      />
      <uni-list-item
        showExtraIcon="true"
        :extraIcon="{ type: 'auth-filled' }"
        title="部门"
        :rightText="deptName"
      />
      <uni-list-item
        showExtraIcon="true"
        :extraIcon="{ type: 'staff-filled' }"
        title="岗位类别"
        :rightText="jobCategory"
      />
      <uni-list-item
        showExtraIcon="true"
        :extraIcon="{ type: 'calendar-filled' }"
        title="岗位名称"
        :rightText="postName"
      />
      <uni-list-item
        showExtraIcon="true"
        :extraIcon="{ type: 'calendar-filled' }"
        title="入职时间"
        :rightText="form.entryTime"
      />
      <uni-list-item
        showExtraIcon="true"
        :extraIcon="{ type: 'calendar-filled' }"
        title="备注信息"
        :rightText="form.remark"
      />
    </uni-list>
  </view>
</template>

<script>
import { getInduction } from "@/api/hrm/staff/induction";
import { getDicts } from "@/api/system/dict/data.js";
import { treeselect } from "@/api/system/dept";
import { getPost } from "@/api/system/post";

export default {
  data() {
    return {
      deptName: "",
      deptOptions: null,
      TypeOptions: [],
      jobCategory: "",
      jobCategorys: [],
      form: {},
      postName: "",
    };
  },
  onLoad() {
    Promise.all([
      getDicts("hrm_staff_type"),
      getDicts("job_category"),
      treeselect(),
    ])
      .then(([staffTypeResponse, jobCategoryResponse, response]) => {
        this.TypeOptions = staffTypeResponse.data;
        this.jobCategorys = jobCategoryResponse.data;
        this.deptOptions = response.data;

        // 在字典数据加载完成后调用 getUser
        this.getUser();
      })
      .catch((error) => {
        console.error("Error loading dictionary data:", error);
      });
  },
  methods: {
    getUser() {
      let tokenList = uni.getStorageSync("storage_data") || {};
      let id = tokenList.vuex_id;
      getInduction(id)
        .then((response) => {
          this.form = response.data;

          // 在职状态
          let staff = this.TypeOptions.find(
            (item) => item.dictValue == this.form.staffType
          );
          this.form.staffType = staff.dictLabel;

          //部门
          this.deptName = this.getParentLabels(
            this.form.deptId,
            this.deptOptions
          )
            .reverse()
            .join("/");

          //岗位类别
          let jobCategory1 = this.jobCategorys.find(
            (item) => item.dictValue == this.form.postTypeCode
          );
          this.jobCategory = jobCategory1.dictLabel;

          // 岗位名称

          getPost(this.form.postId).then((response) => {
            this.postName = response.data.postName;
          });
        })
        .catch((error) => {
          console.log(error);
        });
    },

    getTreeselect() {
      treeselect().then((response) => {
        this.deptOptions = response.data;
      });
    },

    getParentLabels(deptId, deptOptions) {
      if (!deptOptions || deptOptions.length === 0) {
        return []; // 如果 deptOptions 未定义或为空，返回空数组
      }

      let labels = [];
      let found = false;

      deptOptions.some((item) => {
        if (item.id === deptId) {
          labels.push(item.label);
          found = true;
        } else if (item.children && item.children.length > 0) {
          const childLabels = this.getParentLabels(deptId, item.children);
          if (childLabels.length > 0) {
            labels = childLabels.concat(item.label);
            found = true;
          }
        }
        return found;
      });

      return labels;
    },
  },
};
</script>

<style lang="scss">
page {
  background-color: #ffffff;
}
</style>
